<template>
	<view style="text-align: center;margin-top: 30px;">
		<view class="">
			<i class="ri-checkbox-circle-fill" style="color:#008040;font-size:100px;"></i>
			<!-- <i-icon size="100px" color="#008040" name="checkbox-circle-fill"></i-icon> -->
		</view>
		<view class="h2 b30">您已预约成功</view>
		<view class="bkk">
			<view class="bl">
				<view class="">
					预约项目
				</view>
				<view class="bc">
					<i class="ri-checkbox-circle-fill" style="color:#008040;font-size:26px;"></i>
					<!-- <i-icon size="26px" color="#008040" name="checkbox-circle-fill"></i-icon> -->
					<text>{{appoint.serviceName}}</text>
				</view>
			</view>
		</view>
		<view class="bkk">
			<view class="bl">
				<view class="">
					预约时间
				</view>
				<view class="" v-if="appoint.serviceDate">
					{{appoint.serviceDate}}
				</view>
				<view>
					[全天]
				</view>
			</view>
		</view>
		<view class="bkk">
			<view class="bl">
				<view class="">
					服务地点
				</view>
				<view class="">
					{{appoint.serviceSite}}
				</view>
			</view>
		</view>
		<view class="bkk">
			<view class="bl">
				<view class="">
					预约类型
				</view>
				<view class="">
					{{appoint.type}}
				</view>
			</view>
		</view>
		<view class="bkk b30">
			<view class="bl">
				<view class="">
					服务价格
				</view>
				<view class="">
					{{appoint.price}}{{appoint.unit}}
				</view>
			</view>
		</view>
		<view class="bz">
			<button @click="toIndex()">完成</button>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				appoint: {
					serviceName: '',
					serviceDate: '',
					serviceSite: '',
					type: '',
					state: '',
					price: '',
					unit: ''
				},
				serviceName: '[服务名称]',
				serviceDate: '[服务时间]',
				serviceSite: '[服务地点]'
			}
		},
		methods: {
			toIndex: function() {
				uni.redirectTo({
					url: '../u/u-fwdd'
				})
			}
		},
		onLoad(p) {
			// console.log(p)
			if (p.serviceSite && p.serviceName) {
				this.appoint.serviceName = p.serviceName
				this.appoint.serviceDate = p.serviceDate
				this.appoint.serviceSite = p.serviceSite
				this.appoint.type = p.type
				this.appoint.price = p.price
				this.appoint.unit = p.unit
			} else {
				uni.showToast({
					title: '页面数据错误',
					icon: 'error',
					duration: 3000
				})
			}
		}
	}
</script>

<style>

</style>
